<!--<template>-->
<!--  <el-header class="header">-->
<!--    <el-row type="flex" justify="space-between" align="center">-->
<!--      <el-col>-->
<!--        <el-menu mode="horizontal" router :default-active="$route.path">-->
<!--          <el-menu-item index="/manageInfo" class="item">管理员功能</el-menu-item>-->
<!--          <el-menu-item index="/tasteHome" class="item">网站首页</el-menu-item>-->
<!--          <el-menu-item index="/community" class="item">美食社区</el-menu-item>-->
<!--          <el-menu-item index="/canteen" class="item">餐厅预约</el-menu-item>-->
<!--          <el-menu-item index="/modules" class="item">-->
<!--            个人订单-->
<!--          </el-menu-item>-->
<!--          &lt;!&ndash; 根据用户类型动态显示订单中心或个人订单 &ndash;&gt;-->
<!--          &lt;!&ndash;          <el-menu-item index="/modules" class="item">&ndash;&gt;-->
<!--          &lt;!&ndash;            {{ userType === '0' ? '订单中心' : '个人订单' }}&ndash;&gt;-->
<!--          &lt;!&ndash;          </el-menu-item>&ndash;&gt;-->
<!--        </el-menu>-->
<!--        <div class="right-buttons">-->
<!--          当前登录：-->
<!--          <router-link v-if="isLoggedIn" to="/userInfo" class="username" >{{ username }}</router-link>-->
<!--          <router-link v-else to="/login" class="login-link">未登录</router-link>-->
<!--        </div>-->
<!--      </el-col>-->
<!--    </el-row>-->
<!--  </el-header>-->
<!--</template>-->

<!--<script>-->
<!--import { ElMenu, ElMenuItem } from 'element-plus';-->

<!--export default {-->
<!--  name: 'HeaderComponent',-->
<!--  components: {-->
<!--    ElMenu,-->
<!--    ElMenuItem,-->
<!--  },-->
<!--  data() {-->
<!--    return {-->
<!--      isLoggedIn: false,-->
<!--      username: '',-->
<!--      userType: '', // 新增用户类型字段-->
<!--    };-->
<!--  },-->
<!--  mounted() {-->
<!--    // 从 localStorage 中获取 token 和 username-->
<!--    this.isLoggedIn = !!localStorage.getItem('token'); // 假设 token 存在即表示已登录-->
<!--    this.username = localStorage.getItem('username') || '';-->
<!--    this.userType = localStorage.getItem('type') || ''; // 获取用户类型-->
<!--    console.log('username::' , this.username)-->
<!--  },-->
<!--};-->
<!--</script>-->

<!--<style scoped>-->
<!--.header {-->
<!--  background-color: #43678e;-->
<!--  padding: 0;-->
<!--  margin: 0 10px;-->
<!--}-->

<!--.right-buttons {-->
<!--  display: flex;-->
<!--  align-items: center;-->
<!--  justify-content: flex-end; /* 将内容靠右对齐 */-->
<!--}-->

<!--.item{-->
<!--  border: none;-->
<!--}-->

<!--el-menu-item:hover{-->
<!--  color: #4a688a;-->
<!--}-->

<!--.custom-button {-->
<!--  border: none; /* 去除按钮边框 */-->
<!--  padding: 0; /* 去除默认内边距 */-->
<!--  background-color: transparent; /* 去除背景色 */-->
<!--  color: #333333; /* 设置字体颜色为黑色 */-->
<!--  margin-left: 10px; /* 按钮之间的间距 */-->
<!--}-->

<!--.user-profile {-->
<!--  margin-left: 20px;-->
<!--}-->

<!--.username {-->
<!--  font-size: 16px;-->
<!--  color: #333;-->
<!--  margin-left: 10px;-->
<!--  text-decoration: none;-->
<!--}-->

<!--.username:hover {-->
<!--  color: #4a688a;-->
<!--}-->

<!--.login-link {-->
<!--  font-size: 16px;-->
<!--  color: #4a688a;-->
<!--  text-decoration: none;-->
<!--}-->
<!--</style>-->
